<style>
.oss{
    padding-left:20px;
}  
.file {
    position: relative;
    display: inline-block;
    background: #D0EEFF;
    border: 1px solid #99D3F5;
    border-radius: 4px;
    padding: 4px 12px;
    overflow: hidden;
    color: #1E88C7;
    text-decoration: none;
    text-indent: 0;
    line-height: 20px;
}

.file input {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
}

.file:hover {
    background: #AADFFD;
    border-color: #78C3F3;
    color: #1E88C7;
    text-decoration: none;
}
.center{
    width:100%;
    height:100%;
    color:#004974;
    text-align: center;
}

</style>
<template>
  <div class="oss">
    <a href="javascript:;" class="file">选择文件
        <input type="file" accept=".vcf,.vcf.gz,.txt" @change="upFile($event)">
    </a>
  </div>
</template>

<script>
var co = require('co');
var OSS = require('ali-oss');
var client;
import { data } from 'api/index.js';
import { getCookie } from '@/common/js/cookie.js';
import { Loading } from 'element-ui';
export default {
    name:"oss",
    props:["sampleid"],
    data(){
        return{
            file:"",     //文件obj
            fileName:"", //文件名
            fileType:"", //1：txt 2:vcf 3:excel
            sampleId:"", //样本id
            fileKey:"",
            loadingServer:"",//加载loading
            suffix:""    //文件后缀名
        }
    },
    methods:{
        upFile(event){
            this.file = event.target.files[0];
            this.fileName = this.file.name;
            var fileType = this.getFileType();
            this.getFileKey(fileType);
        },
        //设置对象存储参数
        setOss(obj){
            client = new OSS({
                region: obj.endpoint,
                accessKeyId: obj.access_key,
                accessKeySecret: obj.secret_key,
                bucket: obj.bucket
            });
            this.fileKey = obj.fileKey;
            this.doUploadFile(obj.fileKey);
        },
        //获取文件类型     
        getFileType(){
            var mType="";
            var str = this.fileName;
            var type=str.slice(str.lastIndexOf('.')+1,str.length);
            if(type == "txt"){
                mType = '1';
            }else if(type == "vcf"){
                mType = '2';
            }else if(type == "excel"){
                mType = '3'
            }else{
                mType = type;
            }
            this.suffix = type;
            return mType;
        },
        //调取后台接口，获得对象存储key值
        getFileKey(type){
            var obj={
                "userId": getCookie("userid"),
                "productId": this.$store.state.productId,
                "type":parseInt(type),
                "fileName": this.fileName,
                "sampleId":this.sampleid
                
            }
            data.getOSSkey(obj).then((data) => {
               if(data.returnCode == 200 || data.returnCode == 0){
                    this.setOss(data.data);
               }else{
                  this.$Message.error(data.msg);
                  return;
               }
            }).catch((err) => {
                
            })
        },
        //开始上传
        doUploadFile(file){
            var _this=this;
            //var fileKey = file+"."+this.suffix;
            var fileKey = file;
            var fileObj = this.file;
            console.log(fileObj);
            this.loadingServer = Loading.service({
                "target":document.querySelector(".oss"),
                "text": "文件上传中。。。。" 
            });
           
           
            co(function* () {
                var result = yield client.put(fileKey, fileObj);
                if (result.res.statusCode == "200") {
                    _this.$Message.success("上传成功"); 
                   $(".oss").append("<div class = 'center'>上传成功...</div>")
                    _this.doRegisterFileBySampleId();
                }
                _this.loadingServer.close();
            }).catch(function(err) {
                console.log(err);
                _this.loadingServer.close();
            });
        },
        //上传成功后回调后台
        doRegisterFileBySampleId(){
            var obj={
                "sampleid": this.sampleId,
                "type": this.getFileType(),
                "filekey": this.fileKey,
                "size":this.file.size,
                "uploadMethod": 1,
                "fileName": this.fileName,
                "userId": getCookie("userid")
            };
            console.log(obj);
            data.registerFileBySampleId(obj).then((data) => {
                if (data.returnCode == 200 || data.returnCode == 0) {
                     
                } else {
                    this.$Message.error(data.msg);
                    return;
                }
            }).catch((err) => {

            })
        }
    },
    created() {

    },
    watch:{
        sampleid(val){
            this.sampleId = val;
        }
    }
}
</script>


